<script setup lang="ts">
  const props = defineProps<{
    title: string
  }>()
</script>

<template>
  <view class="section-title">
    <image v-if="title === '欧皇赏'" class="section-icon" src="/static/icons/ouhuangshang.png" />
    <image v-if="title === '动力赏'" class="section-icon" src="/static/owo/yifanshang.png" />
    <image v-if="title === '一番赏'" class="section-icon" src="/static/owo/yifanshang.png" />
    <image v-if="title === '对对碰'" class="section-icon" src="/static/icons/duiduipeng.png" />
    <image v-if="title === 'Z元素商城'" class="section-icon" src="/static/icons/z-meta-mall.png" />
    <image v-if="title === 'Z元素福利'" class="section-icon" src="/static/icons/z-meta-weal.png" />
    <image v-if="title === '正在发售'" class="section-icon" src="/static/icons/selling.png" />
    <image v-if="title === '本机奖品池'" class="section-icon" src="/static/icons/z-meta-gift.png" />
    <!-- <text class="section-caption">{{ title }}</text> -->
  </view>
</template>

<style scoped>
  .section-title {
    width: 100%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 6px;
	  height: 66rpx;
  }

  .section-title .section-icon {
    width: 164rpx;
    height: 48rpx;
  }

  .section-title .section-caption {
    font-family: PingFangSC-Regular, sans-serif;
    font-size: 28rpx;
    color: #FFFFD0;
  }
</style>
